<% blogList.forEach(blog => { %>
  <div class="item-wrapper">
    <img class="user-picture" src="<%= blog.user.picture%>"/>
    <div class="content clear-fix">
      <% if (blog.image) { %>
      <a href="<%= blog.image%>" target="_blank">
        <img class="blog-img" src="<%= blog.image%>"/>
      </a>
      <% } %>
      <a href="/profile/<%= blog.user.userName%>">
        <%= blog.user.nickName%>
      </a>:
      <span><%- blog.contentFormat%></span>
    </div>
    <div class="info">
      <span><%= blog.createdAtFormat%></span>
      &nbsp;
      <% if (locals.canReply) { %>
      <%# 可以回复 %>
      <a href="#" class="blog-list-reply"
        data-content="<%= blog.content%>"
        data-userName="<%= blog.user.userName%>"
        data-nickName="<%= blog.user.nickName%>"
      >
        <i class="fa fa-mail-reply"></i> 回复
      </a>
      <% } %>
    </div>
  </div>
<% }) %>

<script>
$(function () {
  // 设置焦点
  function setCursor(el, st, end) {
    if (el.setSelectionRange) {
      el.focus()
      el.setSelectionRange(st, end)
    } else if (el.createTextRange) {
      var range = el.createTextRange()
      range.collapse(true)
      range.moveEnd('character',end)
      range.moveStart('character',st)
      range.select()
    }
  }

  // 回复
  var $textContent = $('#text-content')
  $('.blog-list-reply').click(function (e) {
    e.preventDefault()
    var $target = $(e.target)

    // 获取内容和用户
    var content = $target.attr('data-content')
    var userName = $target.attr('data-userName')
    var nickName = $target.attr('data-nickName')

    // 设置内容并获取焦点
    $textContent.val(' // @' + nickName + ' - ' + userName + ' : ' + content)
    setCursor($textContent[0], 0, 0)
  })
})
</script>
